<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客列表</title>
    <link rel="stylesheet" href="css/myblog_list.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/logout.js"></script>
</head>

<body>
<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <span class="title"><a href="myblog_list.html">我的博客系统</a></span>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_add.html">写博客</a>
    <a href="javascript:logout()">注销</a>
</div>
<!-- 版心 -->
<div class="container">
    <!--    &lt;!&ndash; 左侧个人信息 &ndash;&gt;-->
    <!--    <div class="container-left">-->
    <!--        <div class="card">-->
    <!--            <img src="img/avatar.png" class="avtar" alt="">-->
    <!--            <h3>小可爱</h3>-->
    <!--            <a href="http:www.github.com">github 地址</a>-->
    <!--            <div class="counter">-->
    <!--                <span>文章</span>-->
    <!--                <span>分类</span>-->
    <!--            </div>-->
    <!--            <div class="counter">-->
    <!--                <span>2</span>-->
    <!--                <span>1</span>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
    <!-- 右侧内容详情 -->
    <div id="artListDiv" class="container-right">
        <!--            &lt;!&ndash; 每一篇博客包含标题, 摘要, 时间 &ndash;&gt;-->
        <!--            <div class="blog">-->
        <!--                <div class="title">我的第一篇博客</div>-->
        <!--                <div class="date">2021-06-02</div>-->
        <!--                <div class="desc">-->
        <!--                    从今天起, 我要认真敲代码. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Cum distinctio ullam eum ut-->
        <!--                    veroab laborum numquam tenetur est in dolorum a sint, assumenda adipisci similique quaerat vel.-->
        <!--                    Facere,-->
        <!--                    et.-->
        <!--                </div>-->
        <!--                <a href="blog_content.html?id=1" class="detail">查看全文 &gt;&gt;</a>&nbsp;&nbsp;-->
        <!--                <a href="blog_content.html?id=1" class="detail">修改 &gt;&gt;</a>&nbsp;&nbsp;-->
        <!--                <a href="blog_content.html?id=1" class="detail">删除 &gt;&gt;</a>-->
        <!--            </div>-->
    </div>
</div>

<script>
    // 页面初始化方法
    function init() {
        jQuery.ajax({
            type: "get",
            url: "/art/mylist",
            data: {},
            success: function (res) {
                if (res.code == 200) {
                    var createHtml = "";
                    var artList = res.data;
                    if (artList == null || artList.length == 0) {
                        createHtml += "<h3 style='margin-top: 30px; margin-left: 30px'>当前没有文章," +
                            "请先<a href='blog_add.html'>添加</a>文章</h3>"
                    } else {
                        for (var i = 0; i < artList.length; i++) {
                            var art = artList[i];
                            createHtml += '<div class="blog">';
                            createHtml += '<div class="title">' + art.title + '</div>';
                            createHtml += '<div class="date">' + art.createtime + '</div>';
                            createHtml += '<div class="desc">' + art.content + '</div>';
                            createHtml += '<div class="button">'
                            createHtml += '<a href="blog_content.html?id=' + art.id +
                                '" class="detail">查看全文 &gt;&gt;</a>&nbsp;&nbsp;';
                            createHtml += '<a href="blog_edit.html?id=' + art.id +
                                '" class="detail">修改 &gt;&gt;</a>&nbsp;&nbsp;';
                            createHtml += '<a href="javascript:del(' + art.id + ')" class="detail">删除 &gt;&gt;</a>';
                            createHtml += ' </div>';
                            createHtml += ' </div>';
                        }
                    }
                    jQuery("#artListDiv").html(createHtml);
                } else {
                    alert("抱歉,页面初始化失败!" + res.msg)
                    location.href = "login.html";
                }
            }
        });
    }

    init();

    // 根据 aid 删除文章
    function del(aid) {
        if (confirm("确认删除?")) {
            // 1.参数校验
            if (aid == "" || aid <= 0) {
                alert("参数异常");
                return;
            }
            // 2.将 aid 传递给后端进行删除
            jQuery.ajax({
                type: 'post',
                url: 'art/del',
                data: {
                    "aid": aid
                },
                success: function (res) {
                    // 3.将结果展示给用户
                    if (res.code == 200 && res.data == 1) {
                        alert("删除成功!");
                        location.href = location.href;
                    } else if (res.code == -2) {
                        alert("删除失败!" + res.msg);
                        location.href = 'login.html';
                    } else {
                        alert("删除失败!" + res.msg);
                    }
                }
            });
        }
    }
</script>
</body>

</html>